<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>

<body>
    <!-- 传统标签 -->
    <div id="header"></div>
    <div id="nav"></div>
    <!-- h5新标签 -->
    <header>
        <h1>My Blog</h1>
    </header>
    <!-- 导航 -->
    <nav>
        <ul>
            <li><a href="index.html">首页</a></li>
            <li><a href="about.html">关于我们</a></li>
            <li><a href="services.html">服务</a></li>
            <li><a href="contact.html">联系方式</a></li>
        </ul>
    </nav>
    <!-- 博客文章 -->
    <article>
        <header>
            <h2>Article Title</h2>
            <p>Published on <time datetime="2024-10-09">October 9, 2024</time></p>
        </header>
        <main>
            <!-- 主要内容 -->
        </main>
        <section>
            <h3>Section Title</h3>
            <p>This is the first section of the article, which might include an introduction to the topic.</p>
        </section>
        <section>
            <h3>Another Section Title</h3>
            <p>This section might provide more detailed information or discuss a related topic.</p>
        </section>
    </article>
    <!-- 非核心内容 -->
    <aside>
        <h2>Related Information</h2>
        <nav>
            <ul>
                <li><a href="related-article-1.html">Related Article 1</a></li>
                <li><a href="related-article-2.html">Related Article 2</a></li>
                <li><a href="related-article-3.html">Related Article 3</a></li>
            </ul>
        </nav>
        <p>This aside contains additional information that complements the main article, but is not essential to
            understanding it.</p>
    </aside>
    <!-- 页脚内容 -->
    <footer>
        <p>Footer content goes here.</p>
    </footer>
</body>

</html>